<!DOCTYPE html>
<html>
<head>
	<title></title>
	<link rel="stylesheet" type="text/css" href="bower_components/bootstrap/dist/css/bootstrap.css">
    <link rel="stylesheet" type="text/css" href="styles/main.css">
    <link href="http://www.jiyouh.com/skin/jiyouhui/css/base.css" rel="stylesheet">
    <link href="http://www.jiyouh.com/skin/jiyouhui/css/index.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="http://www.jiyouh.com/skin/jiyouhui/js/mf-pattern/mF_fancy.css">
    <script src="http://www.jiyouh.com/skin/jiyouhui/js/myfocus-2.0.4.min.js"></script>
    <script type="text/javascript" src="jquery-3.1.1.js"></script>
    <script type="text/javascript" src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
</head>
<body>
	<% include header.ejs %>
	<div class="container">
      <div class="row">
        <div class="col-xs-8">
          <div class="articles">
              <h3><%=article.title%></h3>
              <p><%-article.content%></p>
          </div>
        </div>


        <div class="col-xs-4">
          <h3>关注我们</h3>
          <div id="follow">
            <div class="row">
              <div class="col-md-3"><a href="" id="xlwb">新浪微博</a></div>
              <div class="col-md-3"><a href="" id="txwb">腾讯微博</a></div>
              <div class="col-md-3"><a href="" id="yx">邮箱</a></div>
              <div class="col-md-3"><a href="" id="wx">微信</a></div>
            </div>
          </div>
          <img src="images/ad.jpg">
          <div class="article">
            <ul class="nav nav-tabs" id="myTab" >
              <li role="presentation" class="active"><a href="#home" aria-controls="home" role="tab" data-toggle="tab">点击排行</a></li>
              <li role="presentation"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">最新文章</a></li>
              <li role="presentation"><a href="#messages" aria-controls="messages" role="tab" data-toggle="tab">站长推荐</a></li>
            </ul>
            <div class="tab-content">
                <div role="tabpanel" class="tab-pane active" id="home">
                  <ul>
                    <li><a href="">HTC One M9官方图曝光 配置价格一并出炉</a></li>
                    <li><a href="">中兴“咔咔”运动相机在MWC2015上正式展出 剑指小蚁运动相机</a></li>
                    <li><a href="">华为荣耀新总裁亮相 称今年重点立足海外</a></li>
                    <li><a href="">一个女生的十年——手机里一直舍不得删的小说</a></li>
                    <li><a href="">细节也要看清楚，华为MWC2015智能手表高清图赏</a></li>
                    <li><a href="">传谷歌今年5月将推出iOS版本Android Wear</a></li>
                  </ul>
                </div>
                <div role="tabpanel" class="tab-pane" id="profile">
                  <ul>
                    <li><a href="">中兴“咔咔”运动相机在MWC2015上正式展出 剑指小蚁运动相机</a></li>
                    <li><a href="">细节也要看清楚，华为MWC2015智能手表高清图赏</a></li>
                    <li><a href="">华为荣耀新总裁亮相 称今年重点立足海外</a></li>
                    <li><a href="">传谷歌今年5月将推出iOS版本Android Wear</a></li>
                    <li><a href="">半年时间苹果iOS 8普及率终于过了75%！</a></li>
                    <li><a href="">传谷歌今年5月将推出iOS版本Android Wear</a></li>
                  </ul>
                </div>
                <div role="tabpanel" class="tab-pane" id="messages">
                  <ul>
                    <li><a href="">HTC One M9官方图曝光 配置价格一并出炉</a></li>
                    <li><a href="">中兴“咔咔”运动相机在MWC2015上正式展出 剑指小蚁运动相机</a></li>
                    <li><a href="">华为荣耀新总裁亮相 称今年重点立足海外</a></li>
                    <li><a href="">一个女生的十年——手机里一直舍不得删的小说</a></li>
                    <li><a href="">细节也要看清楚，华为MWC2015智能手表高清图赏</a></li>
                    <li><a href="">传谷歌今年5月将推出iOS版本Android Wear</a></li>
                  </ul>
                </div>
            </div>
          </div>
        </div>
      </div>
    </div>
<script type="text/javascript">
  //设置
  myFocus.set({
    id:'myFocus',//ID
    pattern:'mF_fancy'//风格
  });
</script> 
</body>
</html>
<script>
  $(function () {
      $('#myTab a:first').tab('show');
  })
  $('#myTab a').hover(function (e) {
    e.preventDefault();
    $('li').removeClass('active')
    $(this).addClass('active')
    $(this).tab('show');
  })


  /*$(function(){
    $('data-toggle="tab"').hover(function(){
      $(this).tab('show')
    })
  })*/
</script>
</body>
</html>